<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>jQuery仿淘宝购物车</title>
</head>
<link rel="stylesheet" type="text/css" href="../lib/carsmodel/bootstrap.css">

<link type="text/css" rel="stylesheet" href="../lib/carsmodel/style.css" />

<body>
<div class="shopping-car-container">
	<div class="car-headers-menu">
		<div class="row">
			<div class="col-md-1 car-menu">
				<label><input type="checkbox" id="check-goods-all" /><span id="checkAll">全选</span></label>
			</div>
			<div class="col-md-3 car-menu">商品信息</div>
			<div class="col-md-3 car-menu">商品参数</div>
			<div class="col-md-1 car-menu">单价</div>
			<div class="col-md-1 car-menu">数量</div>
			<div class="col-md-1 car-menu">金额</div>
			<div class="col-md-2 car-menu">操作</div>
		</div>
	</div>
	<div class="goods-content">
		<!--goods display-->
	</div>
	<div class="panel panel-default">
		<div class="panel-body bottom-menu-include">
			<div class="col-md-1 check-all-bottom bottom-menu">
				<label>
						<input type="checkbox" id="checked-all-bottom" />
						<span id="checkAllBottom">全选</span>
					</label>
			</div>
			<div class="col-md-1 bottom-menu">
				<span id="deleteMulty">
						清空购物车
				</span>
			</div>
			<div class="col-md-6 bottom-menu">

			</div>
			<div class="col-md-2 bottom-menu">
				<span>已选商品 <span id="selectGoodsCount">0</span> 件</span>
			</div>
			<div class="col-md-1 bottom-menu">
				<span>合计：<span id="selectGoodsMoney">0.00</span></span>
			</div>
			<div class="col-md-1 bottom-menu submitData submitDis">
				结算
			</div>
		</div>
	</div>


<script type="text/javascript" src="../lib/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../lib/carsmodel/script.js"></script>
<script type="text/javascript">
	//删除的点击事件
	$('.goods-content').on('click','.item-delete',function(){
		const id = $(this).data('id')
		// console.log('把数组中 id 为 : ' + id + ' 的数去去掉, 从新渲染页面, 从新存储到 lcoalStorage');
		//获取到localstorage里面的数组
		let list=JSON.parse(localStorage.getItem('carShops'));
		console.log(list)
		
		let list2 = list.filter((item) => {
		            return item.id != id;
		 })
		console.log(list2,'1');
		if(list2.length===0){
			console.log('1')
			window.location.href='./shops.html'
		}
		let goodsList=list2;
		loadGoods();
		
		//存到localstorage里面
		localStorage.setItem('carShops', JSON.stringify(list2));
		location.reload()
		//重新渲染
		// let goodsList = JSON.parse(localStorage.getItem('carShops'));
		// loadGoods();
		
	})
	
	//清空购物车的点击事件
	$('#deleteMulty').click(function(){
		console.log('把数组清空,重新渲染，重新存数据');
		//清除数组
		let list=[];
		//存到localstorage里面
		localStorage.setItem('carShops', JSON.stringify(list));
		// location.reload();
		let goodsList = list;
		loadGoods();
		window.location.href='./shops.html'
		
	})
</script>
</body>
</html>